<template>
  <el-dialog title="预检" :close-on-click-modal="false" :visible.sync="visible" fullscreen center>
    <el-button class="miui-dialog-close-btn" @click="visible = false">关闭页面</el-button>
    <div class="mod-config" style="padding: 0 15px;">
      <div class="custom-info-box">
        <!-- 客户基础信息 -->
        <div class="custom-box">
          <div class="custom-item"><span>姓名：</span><span>{{registerForm.name}}</span></div>
          <div class="custom-item">
            <span>性别：</span>
            <span v-if="registerForm.gender == 0">男</span>
            <span v-if="registerForm.gender == 1">女</span>
          </div>
          <div class="custom-item"><span>出生日期：</span><span>{{registerForm.birthDay}}</span></div>
          <div class="custom-item"><span>联系方式：</span><span>{{registerForm.phone1}}</span></div>
          <!-- <div class="custom-item"><span>就诊事项：</span><span>{{registerForm.registerConfigName}}</span></div> -->
          <div class="custom-item"><span>费别：</span><span>{{registerForm.payType==1?'自费':'医保'}}</span></div>
          <!-- <div class="custom-item"><span>患者ID：</span><span>{{registerForm.uniqueCode}}</span></div> -->
        </div>
        <!-- 客户详细信息 -->
        <!-- <div class="custom-box">
          <div class="custom-item"><span>住址：</span><span>{{registerForm.address}}</span></div>
        </div> -->
      </div>
      <el-form :model="dataForm" :rules="dataRule">
        <table class="miui-table">
          <tr>
            <td class="miui-table-label">身高</td>
            <td class="text-left">
              <el-form-item prop="height" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.height" placeholder="身高"><span slot="append">CM</span></el-input>
              </el-form-item>
            </td>
            <td class="miui-table-label">体重</td>
            <td class="text-left">
              <el-form-item prop="weight" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.weight" placeholder="体重"><span slot="append">KG</span></el-input>
              </el-form-item>
            </td>
            <td class="miui-table-label">体温</td>
            <td class="text-left">
              <el-form-item prop="temperature" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.temperature" placeholder="体温"><span slot="append">°C</span></el-input>
              </el-form-item>
            </td>
          </tr>
        </table>
        <table class="miui-table">
          <tr>
            <td class="miui-table-label"></td>
            <td class="miui-table-label">裸眼远视力</td>
            <td class="miui-table-label">眼压</td>
            <td class="miui-table-label" colspan="3">旧镜度数</td>
            <td class="miui-table-label">瞳距</td>
            <td class="miui-table-label">VA</td>
            <td class="miui-table-label" colspan="3">动态屈光检测</td>
          </tr>
          <tr>
            <td class="miui-table-label">右眼</td>
            <td>
              <el-form-item prop="nakedOd" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.nakedOd"></el-input>
              </el-form-item>

            </td>
            <td>
              <el-form-item prop="iopOd" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.iopOd"></el-input>
              </el-form-item>

            </td>
            <td>
              <el-form-item prop="hisBallOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.hisBallOd" placeholder="球镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="hisPostOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.hisPostOd" placeholder="柱镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="hisAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.hisAxesOd" placeholder="轴向"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="hisAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.interHighOd" placeholder="瞳距"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="hisAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.vaOd" placeholder="VA"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainBallOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.mainBallOd" placeholder="球镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainPostOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.mainPostOd" placeholder="柱镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.mainAxesOd" placeholder="轴向"></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td class="miui-table-label">左眼</td>
            <td>
              <el-form-item prop="nakedOd" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.nakedOs"></el-input>
              </el-form-item>

            </td>
            <td>
              <el-form-item prop="nakedOd" label-width="0">
                <el-input class="input-width-217" v-model="dataForm.iopOs"></el-input>
              </el-form-item>

            </td>
            <td>
              <el-form-item prop="mainBallOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.hisBallOs" placeholder="球镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainPostOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.hisPostOs" placeholder="柱镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.hisAxesOs" placeholder="轴向"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="hisAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.interHighOs" placeholder="瞳距"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="hisAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.vaOs" placeholder="VA"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainBallOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.mainBallOs" placeholder="球镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainPostOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.mainPostOs" placeholder="柱镜"></el-input>
              </el-form-item>
            </td>
            <td>
              <el-form-item prop="mainAxesOd" label-width="0">
                <el-input style="min-width: 60px;" v-model="dataForm.mainAxesOs" placeholder="轴向"></el-input>
              </el-form-item>
            </td>
          </tr>

        </table>
        <table class="miui-table">
          <tr>
            <td class="miui-table-label">色觉</td>
            <td class="text-left">
              <el-radio-group v-model="dataForm.colorSense">
                <el-radio label="1">正常</el-radio>
                <el-radio label="2">色弱</el-radio>
                <el-radio label="3">色盲</el-radio>
              </el-radio-group>
            </td>
          </tr>
        </table>
      </el-form>



      <div class="button-info-box">
        <template>
          <el-button type="primary" size="medium" @click="preSave" v-prevent-re-click>保 存</el-button>
        </template>
      </div>
    </div>
  </el-dialog>
</template>
<script>
  import { filterParams } from '@/util/tools'
  // import { fetchPersonInfoByCode } from '@/api/pvm/person'
  import { preSave ,getPreCheck} from '@/api/admin/optometry/optometry'
  import { getRegister } from '@/api/eims/cashier/register'
  import { mapGetters } from 'vuex'
  import * as check from './check.js'

  export default {
    data() {
      return {
        visible: false,
        infoVisible: false,
        dataForm: {},
        registerForm: {},
        dataRule: {
          height: [{ required: false, validator: check.checkHeight, trigger: 'blur' }],
          weight: [{ required: false, validator: check.checkWeight, trigger: 'blur' }],
          temperature: [{ required: false, validator: check.checkTemperature, trigger: 'blur' }],
          nakedOd: [{ required: false, validator: check.checkNaked, trigger: 'blur' }],
          nakedOs: [{ required: false, validator: check.checkNaked, trigger: 'blur' }],
          iopOd: [{ required: false, validator: check.checkIop, trigger: 'blur' }],
          iopOs: [{ required: false, validator: check.checkIop, trigger: 'blur' }],
          hisBallOd: [{ required: false, validator: check.checkBallGlass, trigger: 'blur' }],
          hisBallOs: [{ required: false, validator: check.checkBallGlass, trigger: 'blur' }],
          hisPostOd: [{ required: false, validator: check.checkPostGlass, trigger: 'blur' }],
          hisPostOs: [{ required: false, validator: check.checkPostGlass, trigger: 'blur' }],
          hisAxesOd: [{ required: false, validator: check.checkAxes, trigger: 'blur' }],
          hisAxesOs: [{ required: false, validator: check.checkAxes, trigger: 'blur' }],
          mainBallOd: [{ required: false, validator: check.checkBallGlass, trigger: 'blur' }],
          mainBallOs: [{ required: false, validator: check.checkBallGlass, trigger: 'blur' }],
          mainPostOd: [{ required: false, validator: check.checkPostGlass, trigger: 'blur' }],
          mainPostOs: [{ required: false, validator: check.checkPostGlass, trigger: 'blur' }],
          mainAxesOd: [{ required: false, validator: check.checkAxes, trigger: 'blur' }],
          mainAxesOs: [{ required: false, validator: check.checkAxes, trigger: 'blur' }]
        }
      }
    },
    components: {},
    computed: {
      ...mapGetters(['permissions', 'bizData'])
    },
    methods: {
      init(data) {
        this.visible = true
        this.dataFormReset()
        this.registerForm = data.customer
        this.dataForm.personId = this.registerForm.id
        if(this.registerForm.id){
          getPreCheck(this.registerForm.id).then(response => {
            if(response.data.code == '0'){
                if(response.data.data.id){
                  this.dataForm = response.data.data
                }
            }else{
              this.$message.error(response.data.msg)
            }
          })
        }

      },
      dataFormReset(){
        for(let key in this.dataForm){
          this.dataForm[key] = ''
        }
      },
      preSave() {
        let list = []
        if (!this.registerForm.id) {
          this.$message.warning('请选择就诊数据')
          return false
        }
        preSave(this.dataForm).then(response => {
          if (response.data.code == 0) {
            this.$message.success('保存成功')
            this.visible = false
            //this.$emit('refreshDataList')
          }else {
              this.$message.error(response.msg)
          }
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  table tr td {
    padding: 8px;
  }

  .custom-info-box {
    border: solid 1px #e7e7e7;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
    border-radius: 4px;
    background-color: #d9e7e9;
    margin-bottom: 15px;
  }

  .tabs-info-box {
    z-index: 1000;
  }

  .button-info-box {
    margin-top: 15px;
    text-align: right;
  }

  .custom-box {
    position: relative;
    display: flex;
    justify-content: flex-start;
    padding: 10px 15px;

    .custom-item {
      flex: auto;
    }
  }
  .text-left {
    text-align: left!important;
  }
  .miui-table {
    width: 100%;
    margin: 10px 0;
    background-color: #b1e2ec3b;
    tr th {
      background-color: #f4f5f7;
    }

    tr th, tr td {
      padding: 10px 8px;
      border: solid 1px #fff;
      text-align: center;
    }
    .miui-table-header td{
      background-color: #7898a8;
      color: #fff;
    }
    .miui-table-tbody{
      background-color: #cadee8;
    }
    .miui-table-label {
      max-width: 120px;
      background-color: #b2d5f6;
    }
  }
</style>
